@extends('frontend/layouts/default')
@section('title')
Hợp âm {{ $data['lyric']->title }}
@endsection
@section('content')
<!--content left-->
@include('frontend/lyrics/_partials/details/script')
<div class="column-left">
    <div>
        <!--ban muon yeu cau hop am-->
        <div class="box-column-left">
            @include('frontend/lyrics/_partials/request-lyric')
        </div>
        <!--ban muon yeu cau hop am end-->
        <!--Hop am cung ca sy-->
        <div class="box-column-left MgT20">
            @include('frontend/lyrics/includes/same-singer',array('sLyrics'=>$data['same_singer'],'singer'=>$data['lyric']->singer_name))
        </div>
        <!--cong cu ho tro end-->
        <!--Videos-->
        <div class="box-column-left MgT20">
            @include('frontend/lyrics/includes/videos-same-name-lyric',array('videos'=>$data['videos']))
        </div>
        <!--Videos end-->
    </div>
</div>
<!--end content left-->
<!--content right-->
<div class="column-right">
    <div class="row-1">
        <!--left-->
        <div class="left">
            @include('frontend/lyrics/_partials/details/left_main')
        </div>
        <!--left end-->
        <!--right-->
        <div class="right">
            <div class="box-search">
                @include('commons/form-search')
            </div>
            <div class="box-tone MgT15">
                @include('frontend/lyrics/_partials/details/box_tone')
            </div>
            <div class="history-edit MgT15">
                @include('frontend/lyrics/_partials/details/other_lyrics')
            </div>
        </div>
        <!--right end-->
    </div>
    <!--view hop am-->
    <div class="view-hopam" style="display: none" id="slide_chord">
        @include('frontend/lyrics/_partials/details/slide_chord')

    </div>
    <!--view hop am end-->
    <!--content hop am-->
    <div class="content-hopam">
        <div class="box-top">
            <div class="left">
                <a href="{{$data['lyric']->fullScreenLink()}}" target="_blank" class="fullscreen">Xem toàn màn hình</a>
            </div>
            <div class="right">
                <div class="toolview FL">
                    <div class="row-item FL lineh-none">
                        <a href="javascript:;" id="i_scroll" class="tone-up FL ">Cuộn trang</a>

                        <div>
                            @include('frontend/lyrics/_partials/details/tools/scroll_panel')
                        </div>
                    </div>

                    <div class="row-item FL MgL5">
                        <div class="positionR" style="top:0">
                            <a class="tone-up" id="tone-up" style="width:52px; cursor: pointer">
                                <i class="fa fa-long-arrow-up"></i></a>
                            <?
                            $allTabs = explode(',', trim($data['guitar_tab']->tabs_qry, ','));
                            ?>
                            <span class="tone" id="main-tone" style="cursor: pointer"><?= end($allTabs) ?></span>
                            <a class="tone-down" id="tone-down" style="width:52px; cursor: pointer">
                                <i class="fa fa-long-arrow-down"></i>
                            </a>

                            <p class="clearfix"></p>
                        </div>
                    </div>
                </div>
                <a href="#" class="active">1 Cột</a>
                <a href="#">2 Cột</a>
                @include('frontend/lyrics/_partials/details/tools/size_text')
            </div>
        </div>
        <div class="ct-ha chord_content" id="lyric_content">
            @include('frontend/lyrics/_partials/details/main')
        </div>
        <div class="ct-ha chord_content">
            @include('frontend/lyrics/_partials/details/form_fix')
        </div>
    </div>
    <!--content hop am end-->
    <div class="row-1">
        <div class="video-cakhuc FL MgT20">
            <!--        <div class="title">-->
            <!--            <label class="title-box">Bài gi?ng ca khúc này</label>-->
            <!--        </div>-->
            <!--        <div class="MgL5">-->
            <!--            <div class="avatar">-->
            <!--                <a href="#">-->
            <!--                    <img src="../images/pic22.jpg" alt="">-->
            <!--                </a>-->
            <!--            </div>-->
            <!--            <div class="MgT7">-->
            <!--                <p class="font18">Hà n?i mùa này v?ng nh?ng c?n m?a</p>-->
            <!---->
            <!--                <div>-->
            <!--                    <span class="color99 font12">b?i:</span>-->
            <!--                    <span class="color55 font12">bachocdientkxx</span>-->
            <!--                </div>-->
            <!--                <div>-->
            <!--                    <span class="color99 font12">3.535</span>-->
            <!--                    <span class="color99 font12">bình ch?n</span>-->
            <!--                    <span class="color99 font12 MgL15">3.535</span>-->
            <!--                    <span class="color99 font12">l??t xem</span>-->
            <!--                </div>-->
            <!--            </div>-->
            <!--            <div class="MgT20">-->
            <!--                <a href="#" class="xembai">Xem các bài gi?ng và video khác c?a ca khúc này</a>-->
            <!--            </div>-->
            <!--        </div>-->
        </div>
        <div class="list-baigiang MgT20">
            @include('frontend/lyrics/includes/lessons-same-tone',array('toneLessons'=>$data['lesson_same_tone']))
        </div>

    </div>
    <!--comment facebook-->
    <div class="MgT20 comment-face">
        <div class="title">
            <label>Bình luận</label>
        </div>
        <div class="btn_tap_cmt">
            <a href="#" class="active">Bằng Facebook
                <div class="arrow_down"></div>
            </a>
            <!--        <a href="#">Bằng tài khoản học đàn</a>-->
        </div>
        <div id="fb-root"></div>
        <div class="fb-comments" data-href="http://developers.facebook.com/docs/plugins/comments/"
             data-width="810" data-numposts="5" data-colorscheme="light"></div>
    </div>
</div>
<script type="text/javascript">
    var chords = new Array();
    chords = <?= $data['guitar_tab']->print_chords_code(); ?>;
</script>
<!--end content right-->
@stop